<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- import CSS -->
    <link rel="stylesheet" href="../node_modules/element-ui/lib/theme-chalk/index.css">

</head>
<body>
<div id="app">

    <div class="block">
        <span class="demonstration">默认</span>
        <el-date-picker
                v-model="value1"
                type="date"
                placeholder="选择日期">
        </el-date-picker>
    </div>
    <div class="block">
        <span class="demonstration">有默认值</span>
        <el-color-picker v-model="color1"></el-color-picker>
    </div>
    <div class="block">
        <span class="demonstration">无默认值</span>
        <el-color-picker v-model="color2"></el-color-picker>
    </div>


</div>
<!-- import Vue before Element -->
<script src="../node_modules/vue/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="../node_modules/element-ui/lib/index.js"></script>
<script>
    new Vue({
        el: '#app',
        data: {
            value1: '',
            color1: '#409EFF',
            color2: null
        }
    })
</script>
</body>
</html>